<template>
  <view class="orders-page">
    <uv-tabs :list="tabs" :current="tab" @change="onTabChange" lineColor="#FF6B00" activeColor="#FF6B00" />

    <scroll-view
      class="list"
      scroll-y
      refresher-enabled
      :refresher-triggered="refreshing"
      @refresherrefresh="onRefresh"
      @scrolltolower="loadMore"
    >
      <uv-empty v-if="!loading && orders.length===0" mode="order" text="暂无订单" />

      <view v-for="it in orders" :key="it.id" class="card">
        <view class="row1">
          <text class="no">订单号：{{ it.order_no }}</text>
          <uv-tags :text="statusText(it.status)" :type="statusType(it.status)" size="mini" plain />
        </view>
        <view class="row2">
          <text class="buyer">买家：{{ it.user_name || '-' }}</text>
          <text class="amount">¥ {{ it.amount || 0 }}</text>
        </view>
        <view class="row3">下单时间：{{ it.created_at || '-' }}</view>
        <view class="ops">
          <uv-button v-if="it.status==='pending'" size="small" type="primary" shape="circle" :loading="actingId===it.id && actingType==='accept'" @tap="accept(it)">接单</uv-button>
          <uv-button v-if="it.status==='pending'" size="small" type="error"  plain shape="circle" :loading="actingId===it.id && actingType==='reject'" @tap="reject(it)">拒单</uv-button>
          <uv-button v-if="it.status==='accepted'" size="small" type="primary" shape="circle" :loading="actingId===it.id && actingType==='ship'" @tap="ship(it)">发货</uv-button>
          <uv-button size="small" plain shape="circle" @tap="detail(it)">详情</uv-button>
        </view>
      </view>

      <view class="loadmore" v-if="!loading && hasMore">上拉加载更多</view>
      <view class="pad" />
    </scroll-view>
  </view>
</template>

<script setup>
// 中文注释：团长订单列表
import { ref, onMounted } from 'vue'
import { leaderApi } from '@/api/index.js'

const tabs = ref([
  { name: '全部', key: 'all' },
  { name: '待接单', key: 'pending' },
  { name: '已接单', key: 'accepted' },
  { name: '已发货', key: 'shipped' },
  { name: '已完成', key: 'completed' }
])
const tab = ref(0)
const orders = ref([])
const page = ref(1)
const pageSize = ref(10)
const hasMore = ref(true)
const loading = ref(false)
const refreshing = ref(false)
const actingId = ref(null)
const actingType = ref('')

const fetchList = async () => {
  if (loading.value || !hasMore.value) return
  loading.value = true
  try {
    const status = tabs.value[tab.value].key
    const data = await leaderApi.getLeaderOrders({ page: page.value, page_size: pageSize.value, status: status==='all'?undefined:status })
    const items = Array.isArray(data?.list) ? data.list : []
    orders.value = page.value === 1 ? items : [...orders.value, ...items]
    hasMore.value = items.length === pageSize.value
    page.value++
  } catch (e) {
    uni.showToast({ title: '加载失败', icon: 'none' })
  } finally {
    loading.value = false
    if (refreshing.value) refreshing.value = false
  }
}

const onTabChange = ({ index }) => {
  tab.value = index
  page.value = 1
  hasMore.value = true
  fetchList()
}

const onRefresh = () => {
  if (refreshing.value) return
  refreshing.value = true
  page.value = 1
  hasMore.value = true
  fetchList()
}

const accept = async (it) => {
  actingId.value = it.id; actingType.value = 'accept'
  try {
    await leaderApi.acceptOrder(it.id)
    uni.showToast({ title: '已接单', icon: 'none' })
    resetAndReload()
  } catch (e) {
    uni.showToast({ title: '操作失败', icon: 'none' })
  } finally {
    actingId.value = null; actingType.value = ''
  }
}
const reject = (it) => {
  uni.showModal({
    title: '拒单原因',
    editable: true,
    placeholderText: '请输入拒绝原因',
    success: async (res) => {
      if (res.confirm) {
        actingId.value = it.id; actingType.value = 'reject'
        try {
          await leaderApi.rejectOrder(it.id, res.content || '')
          uni.showToast({ title: '已拒单', icon: 'none' })
          resetAndReload()
        } catch (e) {
          uni.showToast({ title: '操作失败', icon: 'none' })
        } finally {
          actingId.value = null; actingType.value = ''
        }
      }
    }
  })
}
const ship = async (it) => {
  actingId.value = it.id; actingType.value = 'ship'
  try {
    await leaderApi.shipOrder(it.id)
    uni.showToast({ title: '已发货', icon: 'none' })
    resetAndReload()
  } catch (e) {
    uni.showToast({ title: '操作失败', icon: 'none' })
  } finally {
    actingId.value = null; actingType.value = ''
  }
}

const detail = (it) => {
  uni.navigateTo({ url: `/pages/order/detail?id=${it.id}` })
}

const resetAndReload = () => {
  page.value = 1
  hasMore.value = true
  fetchList()
}

const statusText = (s) => ({ pending: '待接单', accepted: '已接单', shipped: '已发货', completed: '已完成', canceled: '已取消' }[s] || s)
const statusType = (s) => ({ pending: 'warning', accepted: 'primary', shipped: 'success', completed: 'success', canceled: 'error' }[s] || 'primary')

onMounted(fetchList)
</script>

<style scoped lang="scss">
.orders-page { min-height: 100vh; background: $uni-bg-color-grey; }
.list { height: calc(100vh - 120rpx); padding: 16rpx; box-sizing: border-box; }
.card { background: #fff; border-radius: 16rpx; padding: 22rpx; margin-bottom: 16rpx; box-shadow: 0 12rpx 32rpx rgba(0,0,0,0.06); }
.row1 { display: flex; justify-content: space-between; align-items: center; }
.no { color: #222; font-size: 26rpx; font-weight: 600; }
.row2 { display: flex; justify-content: space-between; align-items: center; margin-top: 8rpx; }
.buyer { color: #666; font-size: 24rpx; }
.amount { color: $uni-color-primary; font-weight: 700; }
.row3 { margin-top: 6rpx; color: #999; font-size: 22rpx; }
.ops { margin-top: 12rpx; display: flex; gap: 12rpx; }
.loadmore { text-align: center; color: #999; padding: 20rpx 0; }
.pad { height: 40rpx; }
</style>
